<template>
  <p>
    <button @click="add()" class="btn btn-white btn-default btn-round">
      <i class="ace-icon fa glyphicon-plus"></i>
      新增
    </button>
    &nbsp;
    <button @click="list()" class="btn btn-white btn-default btn-round">
      <i class="ace-icon fa fa-refresh"></i>
      刷新
    </button>
  </p>
  <Pagination ref="pagination" :list="list"></Pagination>
  <table id="simple-table" class="table  table-bordered table-hover">
    <thead>
      <tr><#list fieldList as field>
          <#if field.name!="id" && field.nameHump!="createdAt" && field.nameHump!="updatedAt">
        <th>${field.nameCn}</th></#if></#list>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
    <tr v-for="${domain} in ${domain}s">
      <#list fieldList as field>
        <#if field.name!="id" && field.nameHump!="createdAt" && field.nameHump!="updatedAt">
        <#if field.enums>
        <td>{{ $filter.optionKVArray($Enums.${field.enumsConst}_ARRAY, ${domain}.${field.nameHump})  }} </td>
        <#else>
        <td>{{ ${domain}.${field.nameHump} }} </td>
        </#if>
        </#if>
      </#list>
      <td>
        <div class="btn-group">
          <button class="btn btn-xs btn-info" @click="edit(${domain})">
            <i class="ace-icon fa fa-pencil bigger-120"></i>
          </button>

          <button class="btn btn-xs btn-danger">
            <i class="ace-icon fa fa-trash-o bigger-120" @click="del(${domain}.id)"></i>
          </button>
        </div>
      </td>
    </tr>
    </tbody>
  </table>
  <!-- 弹窗 -->
  <div id="form-modal" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
              aria-hidden="true">&times;</span></button>
          <h4 class="modal-title">表单</h4>
        </div>
        <div class="modal-body">
          <form class="form-horizontal">
            <#list fieldList as field>
              <#if field.name!="id" && field.nameHump!="createdAt" && field.nameHump!="updatedAt">
                <#if field.enums>
                  <div class="form-group">
                    <label class="col-sm-2 control-label">${field.nameCn}</label>
                    <div class="col-sm-10">
                      <select v-model="${domain}.${field.nameHump}" class="form-control">
                        <option v-for="o in $Enums.${field.enumsConst}" v-bind:value="o.key">
                          {{o.value}}
                        </option>
                      </select>
                    </div>
                  </div>
                <#else>
                  <div class="form-group">
                    <label class="col-sm-2 control-label">${field.nameCn}</label>
                    <div class="col-sm-10">
                      <input v-model="${domain}.${field.nameHump}" type="text" class="form-control">
                    </div>
                  </div>
                </#if>
              </#if>
            </#list>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
          <button type="button" class="btn btn-primary" @click="save">保存</button>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->
</template>

<script>
import Pagination from "@/components/pagination";

export default {
  components: {Pagination},
  name: "${domain}",
  data() {
    return {
      ${domain}: {},
      ${domain}s: []
    }
  },
  props: {
    'activeSidebar': {
      type: Function
    }
  },
  mounted() {
    let _this = this;
    // this.activeSidebar("${module}-${domain}-sidebar")
    _this.list(1);
  },
  methods: {
    list(page) {
      Loading.show();
      let _this = this;
      _this.$post(process.env.VUE_APP_SERVER + "/${module}/admin/${domain}/list", {
        page: page,
        size: _this.$refs.pagination.size
      }).then(res => {
        Loading.hide();
        console.log(res);
        let content = res.content;
        _this.${domain}s = content.list;
        _this.$refs.pagination.render(page, content.total);
      }).catch(res => {
        console.log(res);
      });
    },
    add() {
      let _this = this;
      $("#form-modal").modal('show');
    },
    save() {
      let _this = this;
      // 保存校验
      if (1 != 1
              <#list fieldList as field>
              <#if field.name!="id" && field.nameHump!="createdAt" && field.nameHump!="updatedAt" && field.nameHump!="sort">
              <#if !field.nullAble>
              || !Validator.require(_this.${domain}.${field.nameHump}, "${field.nameCn}")
              </#if>
              <#if (field.length > 0)>
              || !Validator.length(_this.${domain}.${field.nameHump}, "${field.nameCn}", 1, ${field.length?c})
              </#if>
              </#if>
              </#list>
      ) {
        return;
      }

      Loading.show();
      _this.$post(process.env.VUE_APP_SERVER + "/${module}/admin/${domain}/save", _this.${domain}).then(res => {
        Loading.hide();
        console.log(res);
        if (res.success) {
          $("#form-modal").modal('hide');
          _this.list(1);
          Toast.success('保存成功！');
        } else {
          $("#form-modal").modal('hide');
          _this.list(1);
          Toast.success(res.message);
        }
      }).catch(res => {
        console.log(res);
      });
    },
    del(id) {
      let _this = this;
      Confirm.show("删除${tableNameCn}后不可恢复!", function () {
        Loading.show();
        _this.$get(process.env.VUE_APP_SERVER + "/${module}/admin/${domain}/del/" + id).then(res => {
          Loading.hide();
          console.log(res);
          if (res.success) {
            Toast.success('删除成功！');
            _this.list(1);
          } else {
            Toast.success('删除失败！');
            _this.list(1);
          }
        }).catch(res => {
          console.log(res);
          Toast.error('删除失败！')
        });
      })
      /*Swal.fire({
        title: '是否确认删除改${tableNameCn}?',
        text: "删除后不可恢复!",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#3085d6',
        cancelButtonColor: '#d33',
        confirmButtonText: '确认!'
      }).then((result) => {
        Loading.show();
        if (result.isConfirmed) {
          let _this = this;
          _this.$get(process.env.VUE_APP_SERVER + "/${module}/admin/${domain}/del/" + id).then(res => {
            Loading.hide();
            console.log(res);
            if (res.code === '200') {
              _this.list(1);
              Toast.success('删除失败！')
            }
          }).catch(res => {
            console.log(res);
            Toast.error('删除失败！')
          });
        }
      })*/
    },
    edit(${domain}) {
      let _this = this;
      _this.${domain} = $.extend({}, ${domain});
      $("#form-modal").modal('show');
    }
  }
}
</script>

<style scoped>

</style>